<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
		<link rel="stylesheet" href="css/style.css">
    </head>
    <body>
        <div class="menu">
            <div class="nav">
                <ul>
                    <li class="on">全部</li>
                    <li>2019年</li>
                    <li>2018年</li>
                    <li>2017年</li>
                </ul>
            </div>
            <div class="list-item">
                <ul>
                    <li><img data-id="1" data-name="直驱与传动" data-title="2019年度第六期刊" src="image/1.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="2" data-name="伺服与控制" data-title="2017年度第六期刊" src="image/2.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="3" data-name="机器人杂志" data-title="2018年度第六期刊" src="image/3.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="4" data-name="直驱与传动" data-title="2018年度第六期刊" src="image/4.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="5" data-name="机器人杂志" data-title="2019年度第六期刊" src="image/5.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="6" data-name="伺服与控制" data-title="2019年度第六期刊" src="image/6.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="7" data-name="直驱与传动" data-title="2015年度第六期刊" src="image/7.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="8" data-name="直驱与传动" data-title="2015年度第六期刊" src="image/8.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="9" data-name="直驱与传动" data-title="2019年度第六期刊" src="image/9.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="10" data-name="直驱与传动" data-title="2019年度第六期刊" src="image/10.jpg" alt=""><span>2019年度第六期刊</span></li>
                    <li><img data-id="10" data-name="直驱与传动" data-title="2019年度第六期刊" src="image/10.jpg" alt=""><span>2019年度第六期刊</span></li>
                </ul>
            </div>
        </div>
        
        <script>
            if (document.documentElement.clientWidth > 500) {
                document.documentElement.style.fontSize = 80 + 'px'
            } else {
                document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px';
            }
        </script>
        <script type="text/javascript" src="js/jquery.min.1.7.js"></script>
        <script>
            $('.menu').find('img').click(function() {
                var id = $(this).data('id')
                var title = $(this).data('title')
                var name = $(this).data('name')
                console.log('id',id)
                var url = encodeURI(encodeURI("./index.html?" + "id=" + id + "&title=" + title + "&name=" + name));
				window.location.href = url
			})

            $('.nav').find('li').click(function() {
                $(this).addClass('on').siblings().removeClass('on')
            })
        </script>
    </body>
</html>